import { defineConfig } from 'vite'
import { resolve } from 'path'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import px2rem from 'postcss-px2rem'
const postcss = px2rem({
  remUnit: 65, //设计稿24等分后的值  1920/24 = 80 1rem=80px
  remPrecision: 2, //转化后小数点位数
})
const srcPath = resolve(__dirname, 'src')
// todo vite:https://vitejs.dev/config/
// todo jsx:https://github.com/vuejs/babel-plugin-jsx/blob/dev/packages/babel-plugin-jsx/README-zh_CN.md
export default defineConfig({
  // 插件
  plugins: [
    vue(),
    vueJsx({
      // 把 on: { click: xx } 转成 onClick: xxx
      transformOn: true,
      // 是否开启优化. 如果你对 Vue 3 不太熟悉，不建议打开
      optimize: true,
    }),
  ],
  // 路径解析
  resolve: {
    // 解析@
    alias: {
      '@/': `${srcPath}/`,
    },
  },
  // 服务配置
  server: {
    open: true,
    host: '0.0.0.0',
    // port: 8081,
    https: false,
    // 允许跨站点伪造
    cors: true,
    // 代理
    proxy: {
      '/api': {
        target: 'http://liuwisdom.icu/api',
        // target: 'http://127.0.0.1:8081/api',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '/'),
      },
    },
  },
  // 样式预处理
  css: {
    // 对less进行预处理
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
      },
    },
    // 引入postcss
    postcss: {
      plugins: [postcss],
    },
  },
  // 环境配置文件路径
  envDir: './',
})
